.wok-ui-dropdown {
  position: relative;
  display: inline-block;

  .wok-ui-dropdown-menu {
    position: absolute;
    top: calc(100% + 5px);
    background-color: white;
    border-radius: var(--size-border-radius);
    border: 1px solid var(--color-border);
    display: none;
    z-index: 1000;
    overflow: hidden;

    &.left {
      left: 0;
    }
    &.right {
      right: 0;
    }
    .wok-ui-dropdown-item {
      font-size: var(--size-text);
      color: var(--color-text);
      padding: 0.5rem 1rem;
      border-bottom: 1px solid var(--color-border);
      cursor: pointer;
      white-space: nowrap;
      &:hover {
        background-color: rgb(248, 249, 250);
      }
      &.disabled {
        opacity: 0.5;
        cursor: not-allowed;
        pointer-events: none;
      }
      &:last-child {
        border-bottom: none !important;
      }
    }
  }

  &.hover:hover {
    .wok-ui-dropdown-menu {
      display: block !important;
    }
  }

  &.open {
    .wok-ui-dropdown-menu {
      display: block !important;
    }
  }
}
// 向上弹
.wok-ui-dropdown.dropup {
  .wok-ui-dropdown-menu {
    top: auto !important;
    bottom: calc(100% + 5px) !important;
  }
}
